<link rel="stylesheet" href="css/cashier_mana/reservation.css" />
<link rel="stylesheet" href="css/cashier_mana/spa_frontSpa.css" />
<link rel="stylesheet" href="assets/css/ui.jqgrid.css" />	

<title data-i18n="前台收银">前台收银</title>
<style>
.btn.btn-app.btn-sm.btn-light.active{
	border: 1px solid #478fca; 
}
</style>
<!-- 遮罩层 -->
<div id="pageOverlay" class="hide"></div>
<!-- 等待动画 -->
<div id="loading" class="loading hide">						
	<i class="ace-icon fa fa-spinner fa-spin orange bigger-250"></i>
</div>
<div class="row">
	
	<div class="col-sm-12 no-padding">
		<div class="well well-sm" style="margin-bottom:0px;">
			<div class="clearfix">
				<div class="pull-left frontspa-search">
<!-- 					<label data-i18n="手牌:"></label> -->
					<input type="text" name="th" autocomplete="off" data-i18n-placeholder="手牌/接待号" class="query-item enter_query" style="height:30px;">
					<div class="btn-group">
                        <button id="btnClear" class="btn btn-sm btn-info" data-i18n="清空" style="margin-top:-4px;margin-left:-4px;">
                            清空
						</button>
					</div> 
					<div class="btn-group">
                        <button id="" class="btn btn-sm btn-info" data-i18n="刷手牌" style="margin-top:-4px;margin-left:-4px;">
                            刷手牌
						</button>
					</div> 
<!-- 					<label data-i18n="接待号:"></label> -->
<!-- 					<input type="text" name="jdh" data-i18n-placeholder="接待号" class="query-item enter_query"> -->
					<div class="btn-group">
                        <button id="btnSearch" class="btn btn-sm btn-info" data-i18n="搜索" style="margin-top:-4px;margin-left:20px;">
                            搜索
						</button>
					</div> 
				</div>
				<div class="pull-right">
					<div class="btn-group">
						<button id="btnBack" class="btn btn-sm btn-default" data-i18n="返回">
                            返回
							<i class="ace-icon fa fa-undo"></i>						
						</button>					
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div class="col-xs-12 margin-10 query-header-container" id="jdhContainer">
		<div class="hotel_option_list flex-wrap" id="jdhList"></div>
		<div class="pagination no-margin no-padding" id="pagination"></div>
	</div>
	
	<div class="col-sm-12 no-padding" style="margin-top:10px;">
		<div class="widget-box row" id="ct_group">
			<div class="col-sm-12 no-padding">
				<div class="col-sm-2 no-padding">
					<div class=" " style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">
						接待号:
					</div>
					<div class=" " style="padding: 6px 10px 6px 4px;text-align: left;max-width:180px;float:left;">
					</div>
				</div>
				<div class="col-sm-2 no-padding">
					<div class=" " style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">
						数量:
					</div>
					<div class="" style="padding: 6px 10px 6px 4px;text-align: left;max-width:180px;float:left;">
					</div>
				</div>
				<div class="col-sm-2 no-padding">
					<div class="" style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">
						消费金额:
					</div>
					<div class="" style="padding: 6px 10px 6px 4px;text-align: left;max-width:180px;float:left;">
					</div>
				</div>
				<div class="col-sm-6 no-padding">
					<div class="col-sm-2 " style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">
						备注:
					</div>
					<div class="col-sm-10 " style="padding: 6px 10px 6px 4px;text-align: left;">
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="brzdContainer" class="col-sm-5 no-padding-left">
		
	</div>
	<div id="brxsxmContainer" class="col-sm-7 no-padding">
		<div class="widget-box">
		
		</div>
	</div>
</div>

<button id="testLedger">结账模态测试</button>

<!-- 国际化 --> 
<script type="text/javascript">
	//加载资源文件
	var scripts = [
                   "js/plugin/jquery.jqGrid.js",
				   "assets/js/jqGrid/i18n/grid.locale-cn.js",
				   //sql查询
				   'js/plugin/jsonsql.js',
				   "js/cashier_mana/jquery.service.frontspa_brzd.js",
				   "js/cashier_mana/jquery.service.frontspa_brxsxm.js",
				   "js/cashier_mana/jquery.plugin.frontspa_jdh.js",
				   "js/plugin/jquery.pagination.js",//分页器
				   "js/cashier_mana/spaLedger.js", 
				   ]; 
	//全窗口变量
	var ins_argjson={};
	$(".page-content-area").ace_ajax("loadScripts",scripts,function(){
		ins_argjson.operGrid = 1;
		var session = {session:{bmh:$.HSAPI_HEADERS.bmh,userid:$.HSAPI_USERID,"username":$.HSAPI_USERNAME}};
		ins_argjson.session = session.session;
		document.title = $.i18n.propJsp("客人账");
		//加载插件
		jf_retrieve_plugin_service();
		
		//初始函数
		jf_retrieve();
		
		//页面事件绑定
		bindEvent();
		
		
	})
	
	//测试结账
	$("#testLedger").bind("click",function(){
		$(this).modalFrame("destroy");
		$(this).modalFrame("init",function(modalEle){   
			$("#"+modalEle).modal("show"); 
			if(!$.isFunction($().spaLedger)){
				$.ajaxSetup({ async: false, cache: false });
	            $.getScript("${contextPath}/static/spa/ledger/spaLedger.js");
	            $.ajaxSetup({ async: true });
			}
			$("#"+modalEle).spaLedger({
				dataBack : function(){
					
				},
				closeBack : function(){
					$("#"+modalEle).modal("hide");
					$("#"+modalEle).empty();
				}
			})
		});
	});
	
	function jf_retrieve(){
		//获取默认数据
		getSpaSubLedgerDefault();
	}
	
	function jf_retrieve_plugin_service(){
		//本日账单
		$("#brzdContainer").frontspa_brzd({
			wait : wait,
			goon : goon,
			bmh : ins_argjson.session.bmh,
			dataBack : function(data){
				
			},
			errorBack : function(){
				
			},
			closeBack : function(){},
			selBack : function(nos){
				freshBrxsxm(nos);
			},
			loadXmCbBack : function(nos){
				freshBrxsxm(nos);
			}
		});
		
		//接待号
		$("#jdhContainer").frontspa_jdh({
			ds : [],
			wait : wait,
			goon : goon,
			dataBack : function(jdh){
				forntspa_search(jdh);
			},
			closeBack : function(){
			}
		});
		
		//本日销售细目
		$("#brxsxmContainer").frontspa_brxsxm({
			wait : wait,
			goon : goon,
			dataBack : function(){
			},
			closeBack : function(){
			},
		})
	}
	
	function wait(){
		$("#pageOverlay").removeClass("hide");
		$("#loading").removeClass("hide");
	}
	
	function goon(){
		$("#pageOverlay").addClass("hide");
		$("#loading").addClass("hide");
	}
	
	function getSpaSubLedgerDefault(){
		var th = $("input[name=th]").val();
		var arg = {"arg":{"th":th}}//"jdh":""
		wait();
		jQuery.ajax({  
    		type : 'POST',
    		url : $.HSAPI_AJAXURL+$.HSAPI_PROCEDURE2_LIST,
    		data : $.HSAPI_ASKJSONINFO(JSON.stringify(arg),'SPAOrderSubLedger_default','{}'),
    		dataType : 'json',  
    		success : function(data){
    			goon();
    			 
    			if(data.RETURN==1){
    				delete data.RETURN
    				delete data.MSG
    				for(k in data){
    					ins_argjson[k] = data[k];
    				}
    				//刷新接待号列表
					freshJdh();
    			}else{
					if(data.hasOwnProperty("gritter")){
						if(data.hasOwnProperty("gritterstyle"))
							jf_successDelayed(data.gritter,2000,data.gritterstyle);
						else
							jf_successDelayed(data.gritter,2000); 
					}else{
	    				jf_alert(data.MSG)
					}
				}
    		},  
    		error : function(data){
    			goon();
    			jf_alert(JSON.stringify(data));
    		}  
    	});
	}
	
	//手牌，接待号查询
	function forntspa_search(jdh){
		var th = $("input[name=th]").val();
		var arg = {"arg":{"th":th}}
		if(jdh){
			arg.arg.jdh = jdh;
		}
		wait();
		jQuery.ajax({  
    		type : 'POST',
    		url : $.HSAPI_AJAXURL+$.HSAPI_PROCEDURE2_LIST,
    		data : $.HSAPI_ASKJSONINFO(JSON.stringify(arg),'SPAOrderSubLedger_Search','{}'),
    		dataType : 'json',  
    		success : function(data){
    			goon();
    			
    			if(data.RETURN==1){
    				delete data.RETURN
    				delete data.MSG
    				for(k in data){
    					ins_argjson[k] = data[k];
    				}
    				freshTitle(data.ct_group[0]);
    				//刷新接待号列表
					freshJdh();
					//初始手牌列表
    				freshBrzd();
    			}else{
					if(data.hasOwnProperty("gritter")){
						if(data.hasOwnProperty("gritterstyle"))
							jf_successDelayed(data.gritter,2000,data.gritterstyle);
						else
							jf_successDelayed(data.gritter,2000); 
					}else{
	    				jf_alert(data.MSG)
					}
					//刷新接待号列表
					freshJdh();
					//初始手牌列表
    				freshBrzd();
				}
    		},  
    		error : function(data){
    			goon();
    			jf_alert(JSON.stringify(data));
    		}  
    	});
	}
	
	//页面事件绑定
	function bindEvent(){
		//查询按钮
		$("#btnSearch").click(function(){
			forntspa_search()
		})
		
		//返回按钮
		$("#btnBack").click(function(){
			history.go(-1);
		})
		
		//回车事件
		$("input[name=th]").keydown(function(e){
			if(e.keyCode==13){
				$("#btnSearch").trigger("click");
			}
		})
		
		//清空
		$("#btnClear").click(function(){
			$("input[name=th]").val("").focus();
		})
	}
	
	function freshTitle(data){
		$("#ct_group").empty();
		var info1_text = ""
		if(data.info1!=""){
			var info1 = JSON.parse(data.info1)
			$.each(info1,function(key,value){
				if(JSON.stringify(value)!="{}"){
					info1_text += getTextStyle(value);
				}
			})
		}
		
		
		var  html = '<div class="col-sm-12 no-padding">'+
						'<div class="col-sm-2 no-padding">'+
							'<div class=" " style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">'+
								'接待号:'+
							'</div>'+
							'<div class=" " style="padding: 6px 10px 6px 4px;text-align: left;max-width:180px;float:left;">'+
								data.jdh+
							'</div>'+
						'</div>'+
						'<div class="col-sm-2 no-padding">'+
							'<div class=" " style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">'+
								'数量:'+
							'</div>'+
							'<div class="" style="padding: 6px 10px 6px 4px;text-align: left;max-width:180px;float:left;">'+
								data.quantity+
							'</div>'+
						'</div>'+
						'<div class="col-sm-2 no-padding">'+
							'<div class="" style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">'+
								'消费金额:'+
							'</div>'+
							'<div class="" style="padding: 6px 10px 6px 4px;text-align: left;max-width:180px;float:left;">'+
								data.xfje+
							'</div>'+
						'</div>'+
						'<div class="col-sm-6 no-padding">'+
							'<div class="col-sm-2 " style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">'+
								'备注:'+
							'</div>'+
							'<div class="col-sm-10 " style="padding: 6px 10px 6px 4px;text-align: left;">'+
								info1_text+
							'</div>'+
						'</div>'+
					'</div>';
		$("#ct_group").append(html);	

		var info2_text = ""
		if(data.info2!=""){
			var info2 = JSON.parse(data.info2)
			$.each(info2,function(key,value){
				if(JSON.stringify(value)!="{}"){
					info2_text += getTextStyle(value);
				}
			})
			var  html = '<div class="col-sm-12 no-padding" style="border-top: 1px dotted #ccc;">'+
							'<div class="col-sm-12 no-padding">'+
								'<div class="" style="padding: 6px 10px 6px 4px;text-align: right;width:100px;float:left;">'+
									'注释:'+
								'</div>'+
								'<div class="" style="padding: 6px 10px 6px 4px;text-align: left;float:left;">'+
									info2_text+
								'</div>'+
							'</div>'+
						'</div>';
			$("#ct_group").append(html);		
		}
	}
	
	//刷新接待号列表
	function freshJdh(){
		$.frontspa_jdh.param.ds = ins_argjson.jdh||[];
		$.frontspa_jdh.initHtml();
	}
	
	//刷新本日账单
	function freshBrzd(){
		$.frontspa_brzd.param.ct_brzd = ins_argjson.ct_brzd||[];
		$.frontspa_brzd.freshBrzdGrid();
	}
	
	//刷星销售细目
	function freshBrxsxm(nos){
		$.frontspa_brxsxm.param.nos = nos;
		$.frontspa_brxsxm.param.load_cbbh = {};
		$.frontspa_brxsxm.getSubLedgerDetail();
	}
</script>